<template>
    <div>
        <dv-scroll-board :config="computedConfig"
            style="width:100%; height: 500px; box-sizing: border-box; padding: 10px;" />
    </div>
</template>

<script setup>
import { onMounted, reactive, ref, computed } from 'vue'
import _ from 'lodash'

const props = defineProps(['data'])

const computedConfig = computed(() => handleData(props.data))

const handleData = (data) => {
    // console.log('employments', data)
    // data.sort((item1, item2) => item1.employ_date > item2.employ_date ? -1 : 1)
    const handledData = data.sort((item1, item2) => Date.parse(item2.employ_date) - Date.parse(item1.employ_date)).map(item => [item.studentname, item.company, item.employ_date])
    // console.log(handledData)
    return reactive({
        header: ['学生姓名', '入职公司', '入职时间'],
        data: handledData,
        index: true,
        index: true,
        columnWidth: [50],
        align: ['center'],
        headerBGC: "rgba(0,0,0,0)",
        oddRowBGC: "rgba(0,0,0,0)",
        evenRowBGC: "rgba(0,0,0,0)",
        carousel: "page",
        hoverPause: true
    })
}
</script>